<!doctype html>
<html>
<head>
    <meta name="author" content="nging@coscms.com"/>
    <title>Web TTY - Nging</title>
    <meta name="theme-color" content="#000000" />
    <link rel="shortcut icon" href="/static/favicon.ico">
    <link rel="stylesheet" href="./style.css"/>
    <link rel="stylesheet" href="./xterm.css"/>
    <link rel="stylesheet" href="./addons/fullscreen/fullscreen.css"/>
    <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/es6-promise/4.1.1/es6-promise.auto.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/fetch/1.0.0/fetch.min.js"></script> -->
    <script src="./xterm.js"></script>
    <script src="./addons/attach/attach.js"></script>
    <!-- <script src="./zmodem.js"></script>
    <script src="./addons/zmodem/zmodem.js"></script> -->
    <script src="./addons/fit/fit.js"></script>
    <script src="./addons/fullscreen/fullscreen.js"></script>
    <script src="./addons/search/search.js"></script>
    <script src="./addons/webLinks/webLinks.js"></script>
    <script src="./addons/winptyCompat/winptyCompat.js"></script>
</head>
<body>
<div style="overflow:hidden">
    <div style="float:right;">
        <p style="margin:3px;height:25px;line-height:20px">
            <label><input id="find-text"/></label>
            <button id="find-next">查找</button>
            <button id="find-previous">向前</button>
            <button id="toggle-options">选项</button>
            <button onclick="toggleLogin()">登录</button>
            <!-- <button onclick="toggleFullscreen()">全屏</button> -->
        </p>
        <div id="login" class="hide">
            <h2 style="margin-top:0">请输入用户名和密码</h2>
            <p>
                <label>用户名 <input type="text" id="userName"> </label>
            </p>
            <p>
                <label>密码 <input type="password" id="password"></label>
            </p>
            <button id="ssh-login">确认</button>
        </div>
        <div id="options" class="hide">
            <h2 style="margin-top:0">选项</h2>
            <p>
                <label><input type="checkbox" id="option-cursor-blink" checked> 光标闪烁</label>
            </p>
            <p>
                <label>
                    光标样式
                    <select id="option-cursor-style">
                        <option value="block">block</option>
                        <option value="underline">underline</option>
                        <option value="bar">bar</option>
                    </select>
                </label>
            </p>
            <p>
                <label>
                    铃声(试验性功能)
                    <select id="option-bell-style">
                        <option value="">none</option>
                        <option value="sound">sound</option>
                        <option value="visual">visual</option>
                        <option value="both">both</option>
                    </select>
                </label>
            </p>
            <p>
                <label>屏幕缓冲区 <input type="number" id="option-scrollback" value="1000"/></label>
            </p>
            <p>
                <label>Tab 字符宽度 <input type="number" id="option-tabstopwidth" value="8"/></label>
            </p>
            <div>
                <h3>大小</h3>
                <p>
                    <label for="cols">列</label>
                    <input type="number" id="cols" value="80"/>
                </p>
                <p>
                    <label for="rows">行</label>
                    <input type="number" id="rows" value="32"/>
                </p>
            </div>
        </div>
    </div>
    <div>
        <h3 id="title">No title</h3>
    </div>
</div>
<div id="terminal-container"></div>
<!-- <div id="zmodem_controls">
    <form id="zm_start" style="display: none" action="javascript:void(0)">
        ZMODEM detected: Start ZMODEM session?
        <label><input id="zmstart_yes" name="zmstart" type=radio checked value="1"> Yes</label>
        &nbsp;
        <label><input name="zmstart" type=radio value=""> No</label>
        <button type="submit">Submit</button>
    </form>

    <form id="zm_offer" style="display: none" action="javascript:void(0)">
        <p>ZMODEM File offered!</p>

        <label><input id="zmaccept_yes" name="zmaccept" type=radio checked value="1"> Accept</label>
        &nbsp;
        <label><input name="zmaccept" type=radio value=""> Skip</label>
        <button type="submit">Submit</button>
    </form>

    <div id="zm_file" style="display: none">
        <div>Name: <span id="name"></span></div>
        <div>Size: <span id="size"></span></div>
        <div>Last modified: <span id="mtime"></span></div>
        <div>Mode: <span id="mode"></span></div>
        <br>
        <div>Conversion: <span id="zfile_conversion"></span></div>
        <div>Management: <span id="zfile_management"></span></div>
        <div>Transport: <span id="zfile_transport"></span></div>
        <div>Sparse? <span id="zfile_sparse"></span></div>
        <br>
        <div>Files remaining in batch: <span id="files_remaining"></span></div>
        <div>Bytes remaining in batch: <span id="bytes_remaining"></span></div>
    </div>

    <form id="zm_progress" style="display: none" action="javascript:void(0)">
        <div><span id="percent_received"></span>% (<span id="bytes_received"></span> bytes) received</div>
        <button id="zm_progress_skipper" type="button" onclick="skip_current_file();">Skip File</button>
    </form>

    <form id="zm_choose" style="display: none" action="javascript:void(0)">
        <label>Choose file(s): <input id="zm_files" type="file" multiple></label>
    </form>
</div> -->
<script src="./common.js"></script>
<!-- <script src="./zmodem_utils.js"></script> -->
<script src="./main.js"></script>
</body>
</html>
